
<template>
  <div id="mainMenu" class="p-box">
    <div class="p-header shadow">
      <WeatherModule></WeatherModule>
    </div>
    <div class="p-content">
      <div class="entry-box" style="margin-bottom:0.09rem">
        <div class="entry-list">
          <div
            class="entry-item"
            v-for="(item) in entryList"
            :key="item.id"
            @click="skipPage(item)"
          >
            <img :src="item.src" alt />
            <span>{{item.name}}</span>
            <span class="redpoint" v-if="item.id == 'e2' && totalCount>0"></span>
          </div>
        </div>
      </div>
      <div class="m-box" v-for="(menu) in menuList" :key="menu.id" >
        <div class="m-title">{{menu.moduleName}}</div>
        <div class="m-content">
          <div class="menu-list">
            <div
              class="menu-item"
              v-for="(mod) in menu.moduleList"
              :key="mod.id"
              @click="skipPage(mod)"
              v-power="mod.power"
            >
              <img :src="mod.src" alt :class="mod.imgClass?mod.imgClass:''" />
              <span>{{mod.name}}</span>
            </div>
          </div>
          <div class="account-skip" v-if="menu.id==3">
            <span @click.stop="skipAccountPage">点击获取质量管理查询公用账号</span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import WeatherModule from "@/weather/WeatherModule";
export default {
  name: "mainMenu",
  components: {
    WeatherModule
  },
  data() {
    return {
      totalCount:0,
      entryList: [
        {
          id: "e1",
          name: "预警信息",
          src: require("#/assets/img/menu/warningMessage.png"),
          path: "WarningMessage"
        },
        {
          id: "e2",
          name: "待办任务",
          src: require("#/assets/img/menu/taskToDo.png"),
          path: "TaskToDo",
        },
        {
          id: "e3",
          name: "抄送我的",
          src: require("#/assets/img/menu/copyMe.png"),
          path: "copyToInfo"
        }
      ],
      menuList: [
        {
          id: "1",
          moduleName: "质量管理工作流",
          moduleList: [
            {
              id: "1-1",
              name: "协同检查",
              src: require("#/assets/img/menu/teamWorkCheck.png"),
              path: "TeamWorkCheck",
              power:"check"
            },
            {
              id: "1-2",
              name: "质量工匠之星",
              imgClass: "specialImg",
              src: require("#/assets/img/menu/craftsmanStar.png"),
              path: "CraftsmanStar",
              power:"star"
            },
            {
              id: "1-3",
              name: "实测实量",
              src: require("#/assets/img/menu/realMeasure.png"),
              path: "RealMeasure",
              power:"measure"
            }
          ]
        },
        {
          id: "2",
          moduleName: "质量管理交底",
          moduleList: [
            {
              id: "2-1",
              name: "专项会议",
              src: require("#/assets/img/menu/meetings.png"),
              path: "meeting",
              power:"meeting"
            },
            {
              id: "2-2",
              name: "数字样板查询",
              src: require("#/assets/img/menu/numberSearch.png"),
              path: "numberTemplate",
              power:"numberTemplate"
            },
            {
              id: "2-3",
              name: "优秀做法展示",
              src: require("#/assets/img/menu/good.png"),
              path: "goodPractice",
              power:"goodPractice"
            },
            {
              id: "2-4",
              name: "典型案例共享",
              src: require("#/assets/img/menu/case.png"),
              path: "caseSharing",
              power:"caseSharing"
            },
            {
              id: "2-5",
              name: "项目质量策划",
              src: require("#/assets/img/menu/cehua.png"),
              path: "qualityPlanning",
              power:"qualityPlanning"
            },
            {
              id: "2-6",
              name: "国家政策法规",
              src: require("#/assets/img/menu/policy.png"),
              path: "nationalPolicy",
              power:"nationalPolicy"
            }
          ]
        },
        {
          id: "3",
          moduleName: "质量管理查询",
          moduleList: [
            {
              id: "3-1",
              name: "现行规范库",
              src: require("#/assets/img/menu/guifan.png"),
              path: "http://www.weboos.com.cn:8089",
              power:"active"
            },
            {
              id: "3-2",
              name: "工艺做法库",
              src: require("#/assets/img/menu/art.png"),
              path: "http://210.13.121.27:4561/",
              power:"craft"
            }
          ]
        }
      ]
    };
  },
  computed: {},
  created() {
    this.initPage();
    this.$nextTick(()=>{
      this.handemptyDOM('m-box','menu-item');
    })
  },
  mounted() {},
  watch: {},
  methods: {
    handemptyDOM(box,testDom){
      let el = document.getElementsByClassName(box)
      if(el.length){
        for(let i=0;i<el.length;i++){
          let str = el[i].innerHTML+'';
          if(str.indexOf(testDom) === -1){
            el[i].style.display = "none";
          }
        }
      }
    },
    skipPage(item) {
      if (item.path.startsWith("http") || item.path.startsWith("https")) {
        let a = document.createElement("a");
        a.href = item.path;
        a.target = "_blank";
        a.click();
      } else {
        this.$router.push({
          name: item.path
        });
      }
    },
    skipAccountPage() {
      this.$router.push({
        name: "CommonAccount"
      });
    },
    initPage() {
      this.$openLoading();
      //待办任务数量
      let params = {
        orgId: this.$A.GS("orgInfo")["orgId"],
        type: this.$A.GS("orgInfo")["type"],
        userId: this.$A.GS("userInfo")["userId"]
      };
      this.$A.Go("get", "/safety/unDoCount/statistic", params).then(
        response => {
          this.$closeLoading();
          if (response.code == 200) {
            this.totalCount = response.body.totalCount;
          }else{
            this.$A.MS(response.msg)
          }
        },
        err => {
          this.$closeLoading();
          console.log(err);
        }
      );
    }
  },
  destroyed() {}
};
</script>

<style lang="scss">
#mainMenu {
  .account-skip {
    text-align: center;
    margin: 0.21rem 0 0.03rem 0;
    span {
      font-size: 0.11rem;
      font-weight: 400;
      color: rgba(177, 177, 177, 1);
      line-height: 0.16rem;
    }
  }
  .redpoint{
    display: inline-block;
    height: 0.10rem;
    width: 0.10rem;
    background-color: #FC334E;
    border-radius: 50%;
    position: absolute;
    top: 0.15rem;
    right: 0.25rem;
  }
}
</style>
